<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="s" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="t" uri="http://tiles.apache.org/tags-tiles"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<s:url var="edit_pessoa_url" value="/pessoas/edit">
    <s:param name="pessoaId" value="${pessoa.id}"/>
</s:url>
<s:url var="pessoas_url" value="/pessoas"/>
<s:url var="anotacoes_url" value="/anotacoes"/>
<s:url var="remove_anotacao_ajax_url" value="/anotacoes/remove"/>
<s:url var="save_anotacao_ajax_url" value="/anotacoes/save"/>

<div class="row-fluid">

    <fieldset>
        <legend>Detalhes da Pessoa
            <c:if test="${pessoa.imported == false}">
                <a href="${edit_pessoa_url}" class="btn btn-info pull-right"><i class="icon-edit"></i> Editar  </a>
            </c:if>
        </legend>


        <p>
            <b>Nome: </b> ${pessoa.nome}
        </p>
         <p>
            <b>Organizacao: </b> ${pessoa.organizacao.sigla}
        </p>
        <p>
            <b>Posto: </b> ${pessoa.posto} 
        </p>
        <p>
            <b>Especialidade: </b> ${pessoa.especialidade} 
        </p>
        <p>
            <b>Data de Nascimento: </b> ${pessoa.dataNascimentoFormatted} 
        </p>
        <p>
            <b>Data de Praça: </b> ${pessoa.dataPracaFormatted} 
        </p>

        <p>
            <b>CPF: </b> ${pessoa.cpf}
        </p>
        <p>
            <b>Identidade: </b> ${pessoa.identidade}
        </p>
        <p>
            <b>SARAM: </b> ${pessoa.saram}
        </p>
        <p>
            <b>Organização importada do Tabelão: </b> ${pessoa.organizacaoFromTabelao} 
        </p>

    </fieldset>

    <fieldset>
        <legend>
            Comentários<span id="anotacoes-loader"></span>
            <security:authorize access="hasAnyRole('ROLE_ADMINISTRADOR', 'ROLE_COORDENADOR')">
                <button onclick="newAnotacao('${pessoa.id}', 'NORMAL')" class="btn btn-info pull-right"><i class="icon-plus"></i> Comentário  </button>
            </security:authorize>
        </legend>
        <div class="widget-main padding-10">
            <div id="${pessoa.id}-container">
            </div>
        </div><!--/widget-main-->



    </fieldset>


    <a class="btn btn-info" href="${pessoas_url}"><i class="icon-ok"></i>Fechar</a>

</div>

<div id="comentario" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h3 id="myModalLabel">Editar Comentário</h3>
    </div>
    <div class="modal-body">

        <form id="aprovar-form" method="post">
            <input name="tipo" id="tipo" type="hidden" value="0"/>
            <input name="objectId" id="objectId" type="hidden" value="0"/>
            <div class="control-group">
                <label class="control-label" for="texto">Comentário:</label>
                <div class="controls">
                    <textarea class="span12 limited texto" id="texto" name="texto" data-maxlength="400"></textarea><br/>
                </div>
                <span class="text-error" id="texto-error"></span>
            </div>
            <div class="control-group">
                <div class="controls">
                    <label>
                        <input type="checkbox" name="visivel" id="visivel"/><span class="lbl">&nbsp; Visível na página Web</span><br/>
                    </label>
                </div>
            </div>
        </form>

    </div>
    <div class="modal-footer">
        <button class="btn" data-dismiss="modal" aria-hidden="true">Fechar</button>
        <button class="btn btn-info" onclick="saveAnotacao()">Salvar</button>
    </div>
</div>



<!-- inline scripts related to this page -->

<script type="text/javascript">

                    function loadAnotacoes(objectId, tipo) {
                        $('#anotacoes-loader').html('<i class="icon-spinner icon-spin orange bigger-125"></i>');
                        $.ajax({
                            url: "${anotacoes_url}",
                            data: {
                                objectId: objectId,
                                tipo: tipo
                            },
                            cache: false
                        }).done(function(html) {
                            $("#" + objectId + "-container").html(html);
                            $('#anotacoes-loader').html("");
                        });
                    }

                    function newAnotacao(objectId, tipo) {

                        $('#tipo').val(tipo)
                        $('#objectId').val(objectId)
                        $('#texto-error').html("");
                        $('#texto').val("");
                        $('#visivel').attr("checked", false);
                        $('#comentario').modal("show");
                    }
                    function saveAnotacao() {

                        var tipo = $('#tipo').val();
                        var objectId = $('#objectId').val();
                        var texto = $('#texto').val();
                        var visivel = $('#visivel').is(':checked');

                        if (texto.length == "" || texto == null) {
                            $('#texto-error').html("Digite o Comentário.");
                            return;
                        } else {
                            $('#texto-error').html("");

                        }

                        $.ajax({
                            type: 'POST',
                            url: "${save_anotacao_ajax_url}",
                            data: {
                                objectId: objectId,
                                texto: texto,
                                visivel: visivel,
                                username: "${userLogin}"
                            },
                            cache: false
                        }).done(function(json) {
                            $('#comentario').modal('hide');
                            loadAnotacoes(objectId, tipo);
                        });




                    }

                    function removeAnotacao(id, objectId, tipo) {

                        var answer = confirm("Tem certeza de que deseja excluir definitivamente este comentário?");
                        if (answer) {
                            $.ajax({
                                url: "${remove_anotacao_ajax_url}",
                                data: {anotacaoId: id},
                                cache: false
                            }).done(function(json) {
                                loadAnotacoes(objectId, tipo);
                            });
                        }
                    }

                    $(function() {

                        loadAnotacoes('${treinamentoSolicitado.objectId}', 'NORMAL');




                        $('[data-rel="tooltip"]').tooltip();
                    })




</script>